:host {
  background-color: var(--ngm-color-surface-container);
  @apply flex flex-col justify-start items-stretch;
}

.tag:not(.selected) {
  @apply bg-slate-50 dark:bg-slate-800;
}
.tag.selected {
  @apply bg-slate-200 dark:bg-slate-500;
}
.tag.selected.slicered {
  @apply text-amber-500 bg-amber-100 dark:text-yellow-300 dark:bg-yellow-900;
}

.ngm-story-explorer__chart.selected {
  @apply ring-violet-500;
}

.cdk-drag-placeholder {
  opacity: 0;
}

.surface {
  background-color: var(--ngm-color-surface);
}
.surface-container {
  background-color: var(--ngm-color-surface-container);
}

.add-dimension:hover {
  background-color: var(--ngm-color-surface);
}